<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>网络跟踪学生页面</title>
<link rel="stylesheet" href="layui/css/layui.css" media="all">

<style>
.layui-btn:not(.layui-btn-lg ):not(.layui-btn-sm):not(.layui-btn-xs) {
	height: 34px;
	line-height: 34px;
	padding: 0 8px;
}
</style>
</head>
<body>
		<div class="layuimini-container">
			<div class="layuimini-main">
				<div class="layui-form" style="margin-top: 20px;" onsubmit="false">
					<div class="layui-form-item">
						<label class="layui-form-label">跟踪者:</label>
						<div class="layui-input-inline">
							<input type="text" name="username" id="username" placeholder="请输入跟踪者姓名" class="layui-input">
						</div>
						
				<div class="layui-inline" id="trackdate">
				<label class="layui-form-label" style="width: 140px;">跟踪起止时间:</label>
					<div class="layui-input-inline" style="width: 150px;">
					    <input type="text" name="trackdatebegin" id="trackdatebegin" placeholder="起始时间" autocomplete="off" class="layui-input">
					</div>
					<div class="layui-form-mid">-</div>
					<div class="layui-input-inline" style="width: 150px;">
						<input type="text" name="trackdateend" id="trackdateend" placeholder="结束时间" autocomplete="off" class="layui-input">
					</div>
			      </div>
					</div>

					<div class="layui-form-item">
						
						<label class="layui-form-label">回访情况:</label>
						<div class="layui-input-inline" style="width: 120;">
							<select name="IsReturnVisit" id="IsReturnVisit" class="layui-input">
								<option value="">请回访情况</option>
								<option value="1">已回访</option>
								<option value="2">未回访</option>
							</select>
						</div>
					<input type="text" name="stuid" id="stuid" placeholder="学生id" hidden="hidden" />
						<label class="layui-form-label">跟踪类型:</label>
						<div class="layui-input-inline">
						<select name="tracktype" id="tracktype"  lay-search>
									<option value=""></option>
									<option value="电话">电话</option>
								    <option value="EMAIL">EMAIL</option>
								    <option value="短信">短信</option>
								    <option value="当面">当面</option>
								</select>
						</div>
						<label class="layui-form-label">跟踪状态:</label>
						<div class="layui-input-inline" style="width: 120;">
							<select name="trackstate" id="trackstate" class="layui-input">
								<option value="">请选择状态</option>
								<option value="1">已完成</option>
								<option value="2">跟进中</option>
								<option value="3">未完成</option>
							</select>
						</div>
						<button class="layui-btn" id="search" data-type="reload" type="button">搜索</button>
					</div>
				</div>
			</div>
			<div>
				<table class="layui-hide" id="test" lay-filter="test"></table>
			</div>
		</div>



	<!-- 操作列 -->
	<script type="text/html" id="barDemo">
            
			<a class="layui-btn layui-btn-normal layui-btn-xs data-count-edit" lay-event="edittrackstudents">信息完善</a>
			<a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="deltrackstudents">删除</a>
		</script>
	<script type="text/html" id="toolbarDemo">
      <!--表头上面引入了一个添加学生的操作-->
      <div class="layui-btn-container">
        <button class="layui-btn layui-btn-sm" lay-event="addtrackstudents">添加跟踪</button>
      </div>
    </script>
	<script src="layui/layui.js" charset="utf-8"></script>
	<script src="js/Global.js" type="text/javascript" charset="utf-8"></script>
	
			<script type="text/html" id="trackstategenzongzhuangtai">
		    {{# if(d.trackstate == 1){ }}
		<span style="color: #F581B1;">已完成</span>
			{{# }else if(d.trackstate == 2){ }}
		<span style="color: #1e9fff;">跟进中</span>
			{{# }else if(d.trackstate == 3){ }}
		<span style="color: #b284be;">未完成</span>
			{{# } }}
		</script>
         
          <script type="text/html" id="IsReturnVisithuifang">
      {{#  if(d.isReturnVisit == 1){ }}
          <span style="color: #F581B1;">已回访</span>
      {{#  } else if(d.isReturnVisit == 2){ }}
          <span style="color: #1e9fff;">未回访</span>
      {{#  } }}
         </script>
      
	<script>
	 layui.use([ 'form', 'table', 'laydate' ],
				function() { //如果只加载一个模块，可以不填数组。如：layui.use('form')
					form = layui.form, table = layui.table;//获取table模块
					var laydate = layui.laydate;
					var $ = layui.jquery;
					//执行一个laydate实例
					laydate.render({
						elem : '#trackdate', //指定元素
						type : 'datetime',
						theme: 'molv',
						trigger : 'click', //采用click弹出
						calendar : true, //允许显示公历节日
						range : [ '#trackdatebegin', '#trackdateend' ]
					});
					// 渲染表格
					setTimeout(function(){
			table.render({
				elem : '#test',
				url : globalData.server+'public/getBystuid',
				toolbar : '#toolbarDemo', //开启头部工具栏
				where : {
					method : 'getAll',
					'stuid':$("#stuid").val(),
					username:'',
					trackstate : '',
					IsReturnVisit:'',
					trackdateend:'',
					trackdatebegin:'',
					tracktype:''
				},
				method : 'POST',
				cols : [ [ {
					field : 'trackid',
					title : '跟踪ID',
					fixed : 'left',
					align:'center',
					sort : true,
					width : 120,
				}, {
					field : 'username',
					title : '跟踪者',
					align:'center',
					width : 90,
				}, {
					field : 'stuname',
					title : '跟踪学生',
					align:'center',
					width : 90,
				}, {
					field : 'tracktype',
					title : '跟踪类型',
					align:'center',
					width : 90,
				}, {
					field : 'isReturnVisit',
					title : '回访情况',
 					templet: '#IsReturnVisithuifang',
 			    	align:'center',
					width : 90,
				}, {
					field : 'trackstate',
					title : '跟踪状态',
					align:'center',
					templet: '#trackstategenzongzhuangtai',
					width : 90,
				} ,{
					field : 'trackcontent',
					title : '跟踪内容',
					align:'center',
					width : 90,
				},{
					field : 'trackdatebegin',
					title : '跟踪开始时间',
					templet : "<div>{{layui.util.toDateString(d.trackdatebegin, 'yyyy-MM-dd HH:mm:ss')}}</div>", 
					align:'center',
					width : 180,
				},{
					field : 'trackdateend',
					title : '跟踪结束时间',
					templet : "<div>{{layui.util.toDateString(d.trackdateend, 'yyyy-MM-dd HH:mm:ss')}}</div>", 
					align:'center',
					width : 180,
				},{
					field : 'trackcreatetime',
					title : '跟踪创建时间',
					templet : "<div>{{layui.util.toDateString(d.trackcreatetime, 'yyyy-MM-dd HH:mm:ss')}}</div>", 
					align:'center',
					width : 180,
				},  {
					title : '操作',
					fixed : 'right',
					align : 'center',
					toolbar : '#barDemo',
					width : 160
				} ] ],
				id : 'testReload',
				page : true
			});
					},100);		
			// 监听搜索操作
					$('#search').on('click', function() {
					var IsReturnVisit = $("#IsReturnVisit").val();
					var username = $("#username").val();
					var trackstate = $("#trackstate").val();
					var trackdatebegin = $("#trackdatebegin").val();
					var trackdateend = $("#trackdateend").val();
					var tracktype = $("#tracktype").val();
					/* var stuid = $("#stuid").val(); */
					//执行搜索重载
					table.reload('testReload', {
						where : {
			     /* if判断 */
			                'IsReturnVisit' : IsReturnVisit,
							'username':username,
							'stuid':$("#stuid").val(),
							'trackdatebegin':trackdatebegin,
							'trackdateend':trackdateend,
							'trackstate':trackstate,
							'tracktype':tracktype
						}
					});
					return false;
					});
					
					
					//监听表格复选框选择
					table.on('checkbox(test)', function(obj) {
						console.log(obj)
					});

					
				     /**
			         * toolbar监听事件
			         */
			        table.on('toolbar(test)', function (obj) {
			            if (obj.event === 'addtrackstudents') {  // 监听添加操作
			                var index = layer.open({
			                    title: '网络跟踪学生添加信息',
			                    type: 2,
			                    shade: 0.2,
			                    maxmin:true,
			                    shadeClose: true,
			                    area : [ '600px', '400px' ],
			                    content: 'TrackStudents_add.html',
			                    success : function(layero, index) {
									var body = layer.getChildFrame('body', index);
										body.find("#stuid").val($("#stuid").val());
								},
			                    end : function() {
					            	window.location.reload();
					          	}
			                });
			                $(window).on("resize", function () {
			                    layer.full(index);
			                });
			            } 
			        });
			        //监听表格复选框选择
			        table.on('checkbox(test)', function (obj) {
			            console.log(obj)
			        });

			        table.on('tool(test)', function (obj) {
			            var data = obj.data;
			            if (obj.event === 'edittrackstudents') {
							var index = layer.open({
								title : '修改 '+data.stuname+" 同学的网络跟踪信息",
								type : 2,
								shade : 0.2,
								maxmin : true,
								shadeClose : true,
								area : [ '600px', '400px' ],
								content : 'TrackStudents_edit.html',
								success : function(layero, index) {
									var body = layer.getChildFrame('body', index);
									layui.form.render();
									var iframe = layero.find('iframe')[0].contentWindow;
									
										body.find("#trackid").val(data.trackid);
										body.find("#username").val(data.username);
										body.find("#stuname").val(data.stuname);
										body.find("#tracktype").val(data.tracktype);
										body.find("#trackstate").val(data.trackstate);
										body.find("#trackcontent").val(data.trackcontent);
										body.find("#trackdatebegin").val(layui.util.toDateString(obj.data.trackdatebegin, 'yyyy-MM-dd HH:mm:ss'));
										body.find("#trackcreatetime").val(layui.util.toDateString(obj.data.trackcreatetime, 'yyyy-MM-dd HH:mm:ss'));
										iframe.layui.form.render('select');
								},
								end : function() {
									window.location.reload();
								}
							});
			                $(window).on("resize", function () {
			                    layer.full(index);
			                });
			            } else if (obj.event === 'deltrackstudents') {
			                layer.confirm('确定要删除 '+data.stuname+' 的跟踪信息吗?', function(index) {
								$.post(globalData.server + "public/deleteTrack", {
									"trackid" : data.trackid
								}, function(res) {
									if(res.count>0) {
										layer.msg("删除成功", {
											icon: 1,
											time: 3000
										});
										obj.del();
									} 
								}, "json");
								layer.close(index);
							});
			            }
			        });

			    });
			</script>
				
</body>
</html>